import { connect } from 'dva';
import styles from './index.less';
import { WingBlank, Tag  } from 'antd-mobile';
import arrowDown from '../../assets/ion-arrow-down-b@3x.png';
import customerImg1 from '../../assets/customerImg1.jpg'

function App({customerDetail,dispatch}) {
    const { text,list } = customerDetail;
    return (
        <div className={styles.normal}>
          <div className={styles.tip}>
            <img className={styles.customerImg} src={customerImg1}/>
            <div className={styles.customerInfo}>
              <div className={styles.InfoModule}>
                <span className={styles.customerProps}>姓名：</span>
                <span className={styles.customerValue}>王大大</span>
                <span className={styles.customerStatus}>已实名</span>
              </div>
              <div className={styles.InfoModule}>
                <span className={styles.customerProps}>性别：</span>
                <span className={styles.customerValue}>男</span>
              </div>
              <div className={styles.InfoModule}>
                <span className={styles.customerProps}>电话：</span>
                <span className={styles.customerValue}>18877886788</span>
              </div>
            </div>
          </div>
          {/*客户视图*/}
          <div className={styles.detailModule}>
            <div className={styles.viewTip}>
              <span className={styles.title}>客户视图</span>
              <div className={styles.tipRight}>
                <span className={styles.packUp}>收起</span>
                <img className={styles.arrow} src={arrowDown} />
              </div>
            </div>
            <div className={styles.viewDetail}>
              <div className={styles.InfoModule}>
                <span className={styles.customerProps}>客户归属：</span>
                <span className={styles.customerValue}>长沙</span>
              </div>
              <div className={styles.InfoModule}>
                <span className={styles.customerProps}>客户等级：</span>
                <span className={styles.customerValue}>VIP</span>
              </div>
              <div className={styles.InfoModule}>
                <span className={styles.customerProps}>入网时间：</span>
                <span className={styles.customerValue}>2017-06-19 11:31:24</span>
              </div>
              <div className={styles.InfoModule}>
                <span className={styles.customerProps}>当前套餐：</span>
                <span className={styles.customerValue}>乐享4G不限流量套餐259元</span>
              </div>
            </div>
          </div>
          {/*客户标签*/}
          <div className={styles.detailModule}>
            <div className={styles.viewTip}>
              <span className={styles.title}>客户标签</span>
              <div className={styles.tipRight}>
                <span className={styles.packUp}>收起</span>
                <img className={styles.arrow} src={arrowDown} />
              </div>
            </div>
            <div className={styles.customerTag}>
              <div className={styles.tagList}>
                <span>高消费能力</span>
                <span>流量需求高</span>
                <span>语音需求高</span>
                <span>IT男</span>
              </div>
              <div className={styles.tagList}>
                <span>业务量大</span>
              </div>
            </div>
          </div>
          {/*推荐商品*/}
          <div className={styles.detailModule}>
            <div className={styles.viewTip}>
              <span className={styles.title}>推荐商品</span>
              <div className={styles.tipRight}>
                <span className={styles.packUp}>收起</span>
                <img className={styles.arrow} src={arrowDown} />
              </div>
            </div>
            <div className={styles.productDetail}>
              <span>E家自主融合宽带</span>
              <span>乐享4G不限流量套餐259元</span>
            </div>
          </div>
          {/*到店历史*/}
          <div className={styles.detailModule}>
            <div className={styles.viewTip}>
              <span className={styles.title}>到店历史</span>
              <div className={styles.tipRight}>
                <span className={styles.packUp}>收起</span>
                <img className={styles.arrow} src={arrowDown} />
              </div>
            </div>
            <div className={styles.historyTable}>
              <table>
                <thead>
                  <tr>
                    <td>到店时间</td>
                    <td>厅店</td>
                    <td>购买商品</td>
                    <td>导购员</td>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <td>
                      <span>20180811</span>
                      <span>12:32:12</span>
                    </td>
                    <td>荷花园店</td>
                    <td>
                      <span>华为荣耀10</span>
                      <span>64G黑色</span>
                    </td>
                    <td>HWDG1</td>
                  </tr>
                  <tr>
                    <td>
                      <span>20180811</span>
                      <span>12:32:12</span>
                    </td>
                    <td>荷花园店</td>
                    <td>无</td>
                    <td>无</td>
                  </tr>
                </tbody>
              </table>
            </div>
          </div>
        </div>
    );
}
export default connect(({customerDetail})=>({customerDetail}))(App);
